<template>
  <div class="usercenter">
    <div class="header">
      <div class="header_title">
        <div class="title_avatar">
          <img :src="business.avatar_text" />
        </div>
        <div class="title_content">
          <div class="content_text">{{business.nickname}}</div>
          <div class="content_sm">{{business.mobile}}</div>
        </div>
      </div>
    </div>
    <div class="userorder">
      <div class="order_project">
        <div class="item">
          <router-link to="/sale" class="item">
            <div class="img"> <img src="/assets/images/retail1.png" alt=""></div>
            分销信息
          </router-link>
        </div>
        <div class="item">
          <router-link to="/sale/business" class="item">
            <div class="img"> <img src="/assets/images/retail2.png" alt=""></div>
            分销会员
          </router-link>
        </div>
        <div class="item">
          <router-link to="/sale/money" class="item">
            <div class="img"> <img src="/assets/images/retail3.png" alt=""></div>
            分销佣金
          </router-link>
        </div>
        <div class="item">
          <router-link to="/business/coupon" class="item">
            <div class="img"> <img src="/assets/images/coupon.png" alt=""></div>
            优惠列表
          </router-link>
        </div>
        <div class="item solid-left">
          <router-link to="/business/pay" class="item">
            <div class="img"> <img src="/assets/images/recharge2.png" alt=""></div>
            充值中心
          </router-link>
        </div>
      </div>
    </div>
    <div class="usertool">
      <div class="list">
        <div class="item">
          <router-link to="/business/profile">
            <div class="img">
              <img src="/assets/images/profile.png" alt="">
            </div>
            基本资料
          </router-link>
        </div>
        <div class="item"  v-if="auth!=1">
          <router-link to="/business/email">
            <div class="img"> <img src="/assets/images/email.png" alt=""></div>
            邮箱认证
          </router-link>
        </div>
        <div class="item">
          <router-link to="/address">
            <div class="img"> <img src="/assets/images/address.png" alt=""></div>
            收货地址
          </router-link>
        </div>
        <div class="item">
          <router-link to="/business/record">
            <div class="img">
              <img src="/assets/images/consume.png" alt="">
            </div>
            消费记录
          </router-link>
        </div>
        <div class="item">
          <router-link to="/order">
            <div class="img">
              <img src="/assets/images/recharge2.png" alt="">
            </div>
            我的订单
          </router-link>
        </div>
        <div class="item">
          <router-link to="/business/share">
            <div class="img">
              <img src="/assets/images/quanbu.png" alt="">
            </div>
            种草分享
          </router-link>
        </div>
        <div class="item">
          <a href="javascript:void(0)" @click="logout">
            <div class="img">
              <img src="/assets/images/returns.png" alt="">
            </div>
            退出登录
          </a>
        </div>
      </div>
    </div>
    <div class="userorder">
      <ul class="proul">
        <!-- 显示推荐商品 -->
        <li v-for="(item,key) in ReProducts" :key="key">
          <router-link :to="{path:'/product/info',query:{proid:item.id}}"><img :src="item.thumbs_text" /></router-link>
          <router-link :to="{path:'/product/info',query:{proid:item.id}}">
            <p class="tit">{{item.name}}</p>
          </router-link>
          <div class="price">
            <p>￥{{ item.price }} / {{item.unit_text}}</p>
          </div>
        </li>
      </ul>
    </div>

    <Tabbar />
  </div>
</template>

<script setup>

import { onMounted, ref } from 'vue';

  //获取this对象
  const {proxy} = getCurrentInstance()

  //获取邮箱认证 auth 的值 根据 他的值去设置显示或隐藏 邮箱认证 使用vue的渲染指令
  const auth = proxy.$business.value.auth;
  const business = proxy.$business.value;
  //推荐商品
  const ReProducts = ref([])
  onMounted(async ()=>{
    var result = await proxy.$POST({
      url:'/business/index'
    })
    // console.log(result.data)
    if(result.code == 0){
      proxy.$fail(result.msg);
      return false
    }
    // unit_text单位
    ReProducts.value = result.data.ReProducts
  })

  let logout = () => 
  {
    proxy.$confirm({
        message: '是否确认退出',
    }).then(() => { //确认
        //退出到登录界面
        //退出时重置state
        proxy.$store.$reset()
        proxy.$router.push('/business/login')
        return
    }).catch(() => {})
  }
</script>

<style scoped>
  @import url('/assets/css/BusinessIndex.css');
</style>